<div class="todolist">

    <h1>ToDoList</h1>
    <input class="forming" type="text" [(ngModel)]="keyWords" (keyup) ='doAdd($event)'>
    <!-- 在点击button的时候就能够获取到keyWords的值 -->
    <ul>
        <!-- 这里的【hidden】是因为在angular10之后的版本不在支持多条ng语句并列，而这里的hidden是  是否显示的一个标签 -->
        <li *ngFor="let item of todolist; let key = index" [hidden] ="item.status ==1">
        <input type="checkbox" [(ngModel)]="item.status" (change)="checkboxChange()" class="formingList">{{item.title}}----<button (click)="deleteData(key)">X</button>
    </ul>


    <h2>已完成事项</h2>
    <ul>
        <li *ngFor="let item of todolist; let key = index"  [hidden] ="item.status ==0">
        <input type="checkbox" [(ngModel)]="item.status" class="formingList">{{item.title}}----<button (click)="deleteData(key)">X</button>
    </ul>

    </div>
    
    
    